<?xml version="1.0" encoding="iso-8859-1"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>FusionCharts v3 Documentation</title>
<link rel="stylesheet" href="Style.css" type="text/css" />
<script type="text/JavaScript">
<!--
function MM_openBrWindow(theURL,winName,features) { //v2.0
  window.open(theURL,winName,features);
}
//-->
</script>
</head>

<body>
<table width="98%" border="0" cellspacing="0" cellpadding="3" align="center">
  <tr> 
    <td><h2 class="pageHeader">dataURL Method </h2></td>
  </tr>
  <tr>
    <td valign="top" class="text"><p>In this method, you provide the URL of XML Data Document to FusionCharts. The chart now sends a request for XML data to the specified URL, reads it, parses it and then renders the charts accordingly. The following diagram would help you understand better:</p>
      <p>(Click on the diagram below to see the animated feature tour on this process)</p></td>
  </tr>
  <tr>
    <td valign="top" class="text"><p><a href='#'><img src="Images/dataURLMethod.jpg" alt="Click to see an animated feature tour on this process" width="600" height="329" border="0" onclick="MM_openBrWindow('FeatureTours/XMLMethods.html','xmlMethods','status=yes,scrollbars=yes,resizable=yes,width=775,height=580')"/></a></p>
    <p>&nbsp;</p></td>
  </tr>
  <tr>
    <td valign="top" class="text"><p>As you can see above, the following steps are involved in this process:</p>
      <ol>
        <li>You first send the HTML content and SWF file to the end viewer's browser. Along with the SWF, you also tell where the data is to be pulled from. This URL points to your server side scripts which would output the XML data document for the chart.</li>
        <li>Once the SWF is loaded on the end viewer's machine, it sends a request for XML data document to the specified URL.</li>
        <li>Your server side scripts at this URL now
          <ul>
            <li>Take in the passed parameters (if any)</li>
            <li>Process them</li>
            <li>Interact with the database</li>
            <li>Get data from data base in native objects like Recordsets, Data Readers etc.</li>
            <li>Convert this data into XML format using simple string concatenations or using XML DOM.</li>
            <li>Finally write this data to output stream (NOT physically  on server).</li>
          </ul>
        </li>
        <li>FusionCharts now accepts this XML data, parses it and finally renders the chart. </li>
      </ol>    
      <p class="highlightBlock">If your <span class="codeInline">dataURL</span> contains special characters like ?, &amp; etc., you need to URL Encode. Also, if you want any parameters as a part of <span class="codeInline">dataURL</span> to your server side script, you'll need to URL Encode the entire <span class="codeInline">dataURL</span>. Example: if you want to provide data URL as <span class="codeInline">Data.asp?id=1&amp;subId=2</span>, it should be provided as <span class="codeInline">Data%2Easp%3Fid%3D1%26subId%3D2</span></p>      </td>
  </tr>
  <tr>
    <td valign="top" class="text">&nbsp;</td>
  </tr>
  <tr>
    <td valign="top" class="text"><p>Effectively, in this process you need the following to build a chart:</p>
      <ol>
        <li><strong>Chart Container Page </strong>- The page which contains the HTML code  to embed and show the chart. This page contains the URL for XML Data Document also.</li>
        <li><strong>Chart SWF File</strong></li>
        <li><strong>Data  Provider Page </strong>- The page which will provide XML Data to FusionCharts. This page outputs ONLY XML and no HTML tags. </li>
    </ol></td>
  </tr>
  
  <tr>
    <td valign="top" class="header">Sample Usage of dataURL method using direct HTML Embedding Method </td>
  </tr>
  <tr>
    <td valign="top" class="codeBlock">&lt;object classid=&quot;clsid:d27cdb6e-ae6d-11cf-96b8-444553540000&quot; codebase=&quot;http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0&quot; width=&quot;500&quot; height=&quot;300&quot; id=&quot;Column2D&quot; align=&quot;middle&quot;&gt;
      <br />
      &nbsp;&nbsp;&nbsp;&lt;param name=&quot;movie&quot; value=&quot;Column2D.swf&quot; /&gt;<br />
      <strong>&nbsp;&nbsp;&nbsp;&lt;param name=&quot;FlashVars&quot; value=&quot;&amp;dataURL=Data.asp&quot; /&gt;</strong><br />
      &nbsp;&nbsp;&nbsp;&lt;param name=&quot;quality&quot; value=&quot;high&quot; /&gt;<br />
      &nbsp;&nbsp;&nbsp;&lt;embed src=&quot;Column2D.swf&quot; <strong>FlashVars=&quot;&amp;dataURL=Data.asp&quot;</strong> quality=&quot;high&quot; bgcolor=&quot;#ffffff&quot; width=&quot;400&quot; height=&quot;300&quot; name=&quot;Column2D&quot; align=&quot;middle&quot; allowScriptAccess=&quot;sameDomain&quot; type=&quot;application/x-shockwave-flash&quot; pluginspage=&quot;http://www.macromedia.com/go/getflashplayer&quot; /&gt;<br />
    &lt;/object&gt;</td>
  </tr>
  <tr>
    <td valign="top" class="text">&nbsp;</td>
  </tr>
  <tr>
    <td valign="top" class="header">Sample Usage of dataURL method using FusionCharts JavaScript Class </td>
  </tr>
  <tr>
    <td valign="top" class="codeBlock">&lt;div id=&quot;chart1div&quot;&gt;<br />
&nbsp;&nbsp;&nbsp;This text is replaced by the chart.<br />
&lt;/div&gt;<br />
&lt;script type=&quot;text/javascript&quot;&gt;<br />
&nbsp;&nbsp;&nbsp;var chart1 = new FusionCharts(&quot;Column2D.swf&quot;, &quot;ChId1&quot;, &quot;600&quot;, &quot;400&quot;, &quot;0&quot;, &quot;0&quot;);
<strong><br />
&nbsp;&nbsp;&nbsp;chart1.setDataURL(&quot;Data.asp&quot;);</strong><br />
&nbsp;&nbsp;&nbsp;chart1.render(&quot;chart1div&quot;);<br />
&lt;/script&gt;</td>
  </tr>
  <tr>
    <td valign="top" class="text">&nbsp;</td>
  </tr>
  <tr>
    <td valign="top" class="highlightBlock"><span class="codeInline">dataURL</span> method is the recommended method as it does not place any limits on the size of XML Data. Also, if you're using special characters (UTF-8 or double byte characters) in your XML, you need to necessarily use dataURL method. </td>
  </tr>
</table>
</body>
</html>
